<template>
	<view class="content">

		<image class="perMsg" src="../../static/img/bc-img.png" />
		<div class="wx-login">

			<!-- 	<u-button type="primary" size='medium' open-type="getPhoneNumber" @getphonenumber="getPhone">授权手机号
			</u-button> -->

			<img src="../../static/img/picture.png" alt="" class="wx-image" @click="login" v-if="!wxMsg.avatarUrl">
			<img :src="wxMsg.avatarUrl" alt="" class="wx-image" v-else @click="login">
			<div class="wx-title" @click="login" v-if="!wxMsg.nickName">微信授权登录</div>
			<div class="wx-title" v-else>{{ wxMsg.nickName }}</div>
			<cui-userprofiledialog ref="userProfileDialog" paddingBottom="126rpx"
				style="padding-bottom: 54rpx" :wxMsg="wxMsg"></cui-userprofiledialog>
		</div>
		
		
		
		<div class="msg-box">
			<div class="list" @click="goRouter('/pages/orderManagement/index')">
				<img src="../../static/img/d.png" alt="" class="icon">
				<span class="name">订单管理</span>
				<img src="../../static/img/more-icon.png" alt="" class="right-icon">
			</div>
			<div class="list" @click="goRouter('/pages/infoMsg/index')">
				<img src="../../static/img/a.png" alt="" class="icon">
				<span class="name">信息管理</span>
				<img src="../../static/img/more-icon.png" alt="" class="right-icon">
			</div>
			<div class="list" @click="goRouter('/pages/Favorites/index')">
				<img src="../../static/img/b.png" alt="" class="icon">
				<span class="name">收藏夹</span>
				<img src="../../static/img/more-icon.png" alt="" class="right-icon">
			</div>
			<div class="list" @click="jqqd('/pages/coupon/index')">
				<img src="../../static/img/e.png" alt="" class="icon">
				<span class="name">优惠券</span>
				<img src="../../static/img/more-icon.png" alt="" class="right-icon">
			</div>
			<div class="list"  @click="goRouter('/pages/integral/index')">
				<img src="../../static/img/jfen.png" alt="" class="icon">
				<span class="name">积分</span>
				<img src="../../static/img/more-icon.png" alt="" class="right-icon">
			</div>
			<div class="list" @click="goRouter('/pages/feedback/index')" v-if="feedShow">
				<img src="../../static/img/c.png" alt="" class="icon">
				<span class="name">意见反馈</span>
				<img src="../../static/img/more-icon.png" alt="" class="right-icon">
			</div>
		</div>
		
		<Nav :current="navActive"></Nav>
	</view>
</template>

<script>
	import Nav from '../../component/Nav.vue';
	export default {
		components: {
			Nav,
		},
		data() {
			return {
				navActive: 1,
				wxMsg: {
					nickName: '',
					avatarUrl: '',
					phone: ''
				},
				feedShow: false,
			}
		},
		onLoad(options) {
			try {
				var result = uni.getStorageSync('wxLogin');
				
				console.log(result, 111111)
				if (result.nickName) {
					this.wxMsg = result;
					this.wxlogin()
				}	
			} catch (error) {
				// console.log('获取失败', error);  
				
			}	
			let _this = this;
			setTimeout(() => {
				if(uni.getStorageSync('userSInfo') == 1) {
					// 未登录
					uni.removeStorageSync('userSInfo');
					_this.tapGetUserProfile(1);
				}
			}, 100)
			
			
		},
		onShow() {
				
			this.getFeedBackData();
	
			// this.getData();
		},
		methods: {
			
			// 查询意见反馈信息
			getFeedBackData() {
				let data = {
					customerId: uni.getStorageSync('openId').userId
				}
				this.$http({
					url: this.$myApi.feedBackList + '?customerId=' + data.customerId,
					method: 'GET',
					hideLoading: true,
					// data: data,
					success: res => {
						if (res.code == 200) {
							if (res.rows.length > 0) {
								this.feedShow = false;
							} else {
								this.feedShow = true;
							}
						} else { }
					},
					fail: err => {
						
					},
					complete: e => {
						// uni.stopPullDownRefresh();
					}
				})
			},
			// 敬请期待
			jqqd() {
				uni.showToast({
					title: '敬请期待',
					duration: 2000,
					icon: 'none'
				});
			},
			login() {
				// this.tapGetUserProfile(2)
				if (uni.getStorageSync('openId').phoneFlag == 0) {
					this.tapGetUserProfile(2)
				}
				
			},
			goRouter(url) {
				uni.navigateTo({
					url: url
				})
			},
			
			
			tapGetUserProfile(types) {
				// 使用promise语法
				this.$refs["userProfileDialog"].show({
					desc: "为了您更好的体验该小程序，需要绑定您的账号信息", // 说明
					avatarUrl: {
						requried: true, // 是否必填
						disable: false, // 是否隐藏
					},
					nickName: {
						requried: true, // 是否必填
						disable: false, // 是否隐藏
					}
				}).then(res => {
					// console.log("结果！！！", res, res.avatarUrl, res.nickName);
					this.wxMsg.nickName = res.nickName;
					this.wxMsg.avatarUrl = res.avatarUrl;
					this.wxMsg.phone = res.phone;
					console.log(uni.getStorageSync('openId'));
					// console.log(types, types == 1)
					console.log(this.wxMsg)
					// if(types == 1) {
						console.log('需要编辑用户信息，绑定手机号')
						let data = {
							"phonenumber": res.phone + '',
							// "phonenumber": '',
							"userName": res.nickName + '',
							"nickName": res.nickName  + '',
							"userId": uni.getStorageSync('openId').userId,
							"avatar": res.avatarUrl
						}
						this.$http({
							url: this.$myApi.editUser ,
							method: 'post',
							hideLoading: true,
							data: data,
							success: res => {
								console.log(res,11111111)
								if(res.code == 200) {
									uni.showToast({
										title: '信息更新成功',
										duration: 2000,
										icon: 'none'
									});
								} else {
									uni.showToast({
										title: res.msg,
										duration: 2000,
										icon: 'none'
									});
								}
							},
							fail: err => {
								uni.showToast({
									title: err.msg,
									duration: 2000,
									icon: 'none'
								});
							},
							complete: e => {
								try {
									uni.removeStorageSync('wxLogin')
									uni.setStorageSync('wxLogin', this.wxMsg);
								} catch (error) {
									// console.log('存储失败', error);  
								}
							}
						})
					// }
					
					// 存到uni
				}, err => {
					// console.log("取消")
				});
			},
			// 获取用户手机号
			getPhone(e) {
				
			},
			wxlogin() {
				
			},
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		width: 100%;

		.msg-box {
			width: 690rpx;
			margin-left: 30rpx;
			background-color: #fff;
			border-radius: 10rpx;
			position: absolute;
			top: 307rpx;
			height: calc(100vh - 307rpx);

			.list {
				box-sizing: border-box;
				padding: 0rpx 5rpx 0rp 7rpx;
				height: 103rpx;
				border-bottom: 1rpx solid #C7C7C7;
				display: flex;
				flex-direction: row;
				align-items: center;
				position: relative;

				.icon {
					width: 44rpx;
					height: 44rpx;
					margin-left: 16rpx;
					margin-right: 27rpx;
				}

				.name {
					height: 40rpx;
					font-size: 28rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					color: #2F2F2F;
					line-height: 40rpx;
				}

				.right-icon {
					width: 24rpx;
					height: 24rpx;
					background: #FFFFFF;
					position: absolute;
					right: 24rpx;
					cursor: pointer;
					user-select: none;
				}
			}

		}

		.perMsg {
			width: 750rpx;
			height: 366rpx;
			background-size: 100% 100%;
			position: absolute;
			top: 0rpx;
			left: 0rpx;
		}

		.wx-login {
			position: relative;
			z-index: 1;
			width: 750rpx;
			text-align: center;

			.wx-image {
				width: 160rpx;
				height: 160rpx;
				margin: 0 auto;
				margin-bottom: 21rpx;
				margin-top: 58rpx;
				cursor: pointer;
				user-select: none;
				border-radius: 50%;
				background-size: 100% 100%;
				background-image: url();
			}

			.wx-title {
				height: 34rpx;
				font-size: 24rpx;
				line-height: 34rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				color: #FFFFFF;
				cursor: pointer;
				width: fit-content;
				margin: 0 auto;
			}
		}
	}

	::v-deep {
		.popup-root._div {
			padding-bottom: 60rpx;
		}
	}
</style>
<style>
	page {
		color: #F4F4F4;
	}
</style>